<!-- extend from base layout -->
{% extends "layout.html" %}

{% block content %}
    <div class="container">
    <ol class="breadcrumb">
        <li><a href="/">首页</a></li>
        <li class="active">消息中心</li>
        <li class="active">我要投诉</li>
    </ol>
    <div class="row">
        <div class="table-responsive col-lg-8 col-md-12">
            <form class="form-horizontal" method="post" action="">
                {{ form.csrf_token }}
                <div class="form-group{% if form.user_id.errors %} has-error{% endif %}">
                    {{ form.user_id.label(class="col-sm-2 control-label") }}
                    <div class="col-sm-10">
                        <div class="form-control">{{ form.user_id.data | nickname }}</div>
                    </div>
                </div>

                <div class="form-group{% if form.content.errors %} has-error{% endif %}">
                    {{ form.content.label(class="col-sm-2 control-label") }}
                    <div class="col-sm-10">
                        {{ form.content(class="form-control", placeholder="投诉内容", rows="6") }}
                        {% for error in form.content.errors %}
                            <span class="help-block">{{ error }}</span>
                        {% endfor %}
                    </div>
                </div>
                <div class="form-group">
                    <div class="col-sm-offset-2 col-sm-10">
                        <button type="submit" class="btn btn-success btn-load" data-loading-text="投诉中">投诉</button>
                        <button type="reset" class="btn btn-default">重新填写</button>
                        <button class="btn btn-default" onclick="history.back();">返回</button>
                    </div>
                </div>
            </form>
        </div>
        <!-- 用户概要 -->
        <div class="col-lg-4 col-md-12">
            <!-- 状态信息 -->
            {% include('user/_status.html') %}
            <!-- 推广链接 -->
            {% include('user/_invite_link.html') %}
            <!-- 账户信息 -->
            {% include('user/_account_info.html') %}
            <!-- 我的团队 -->
            {% include('user/_team_tree.html') %}
        </div>
    </div>
    </div>
{% endblock %}

{% block extra_js %}
<script src="{{ url_for('static', filename='plugin/clipboard.js-1.6.1/dist/clipboard.min.js') }}"></script>

<script>
    //推广链接复制
    var clipboard = new Clipboard('.btn');

    clipboard.on('success', function(e) {
        // console.info('Action:', e.action);
        // console.info('Text:', e.text);
        // console.info('Trigger:', e.trigger);
        e.clearSelection();
        alert('复制成功，粘贴使用推广链接');
    });

    clipboard.on('error', function(e) {
        // console.error('Action:', e.action);
        // console.error('Trigger:', e.trigger);
        alert('操作失败，重新复制推广链接');
    });
</script>
{% endblock %}
